<template>
    <div class="evaluation" v-loading="loading">
        <div class="search-area">
            <span class="item-box">
                <span class="item-name">案件类型：</span>
                <span class="item-value">
                    <el-select v-model="caseType" size="small" style="width: 240px;" @change="getCategory">
                        <el-option label="全部" value=""></el-option>
                        <el-option
                                v-for="item in caseTypeData"
                                :label="item.name"
                                :value="item.code" :id="item.id">
                        </el-option>
                    </el-select>
                </span>
            </span>
            <span class="item-box">
                <span class="item-name">大类名称：</span>
                <span class="item-value">
                    <el-select v-model="categoryName" size="small" style="width: 240px;" :disabled="caseType==='' ? true :false" @change="getSubclass">
                        <el-option label="全部" value=""></el-option>
                        <el-option
                                v-for="item in categoryNameData"
                                :label="item.name"
                                :value="item.id">
                        </el-option>
                    </el-select>
                </span>
            </span>
            <span class="item-box">
                <span class="item-name">小类名称：</span>
                <span class="item-value">
                    <el-select v-model="subclassName" size="small" style="width: 240px;" :disabled="categoryName===''? true :false">
                        <el-option label="全部" value=""></el-option>
                        <el-option
                                v-for="item in subclassNameData"
                                :label="item.name"
                                :value="item.id">
                        </el-option>
                    </el-select>
                </span>
            </span>
            <span class="item-box">
                <span class="item-name">责任主体：</span>
                <span class="item-value">
                    <el-select v-model="responsible" size="small" style="width: 240px;" @change="getDepartment">
                        <el-option label="全部" value=""></el-option>
                        <el-option
                                v-for="item in responsibleData"
                                :label="item.name"
                                :value="item.code">
                        </el-option>
                    </el-select>
                </span>
            </span>
            <span class="item-box">
                <span class="item-name">归属部门：</span>
                <span class="item-value">
                    <el-select v-model="department" size="small" style="width: 240px;" :disabled="responsible===''?true:false" @change="getPrimarylist">
                        <el-option label="全部" value=""></el-option>
                        <el-option
                                v-for="item in departmentData"
                                :key="item.value"
                                :label="item.name"
                                :value="item.code">
                        </el-option>
                    </el-select>
                </span>
            </span>
            <span class="item-box">
                <span class="item-name">一级行业：</span>
                <span class="item-value">
                    <el-select v-model="primaryIndustry" size="small" style="width: 240px;" :disabled="department===''?true:false" @change="getSecondarylist">
                        <el-option label="全部" value=""></el-option>
                        <el-option
                                v-for="item in primaryIndustryData"
                                :key="item.value"
                                :label="item.name"
                                :value="item.id">
                        </el-option>
                    </el-select>
                </span>
            </span>
            <span class="item-box">
                <span class="item-name">二级行业：</span>
                <span class="item-value">
                    <el-select v-model="secondaryIndustry" size="small" style="width: 240px;" :disabled="primaryIndustry===''?true:false">
                        <el-option label="全部" value=""></el-option>
                        <el-option
                                v-for="item in secondaryIndustryData"
                                :key="item.value"
                                :label="item.name"
                                :value="item.id">
                        </el-option>
                    </el-select>
                </span>
            </span>
            <span class="item-box">
                <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery()">搜索</el-button>
                <el-button icon="el-icon-refresh" size="mini" @click="resetQuery()">重置</el-button>
            </span>
        </div>
        <div class="content-area">
            <div class="table-list">
                <el-table
                        :data="tableData"
                        border
                        height="100%"
                        :span-method="objectSpanMethod">
                    <el-table-column
                            label="大类代码"
                            prop="levelOneCode"
                            align="center"/>
                    <el-table-column
                            label="大类名称"
                            prop="levelOneName"
                            align="center"/>
                    <el-table-column
                            label="小类代码"
                            prop="levelTwoCode"
                            align="center"/>
                    <el-table-column
                            label="小类名称"
                            prop="levelTwoName"
                            align="center"
                            show-overflow-tooltip/>
                    <el-table-column
                            label="立案条件"
                            prop="starConditions"
                            align="center"
                            show-overflow-tooltip/>
                    <el-table-column
                            label="编码"
                            prop="code"
                            align="center"/>
                    <el-table-column label="可选处置时限" align="center">
                        <el-table-column
                                label="A类"
                                prop=""
                                align="center" :formatter="formatA"/>
                        <el-table-column
                                label="B类"
                                prop=""
                                align="center" :formatter="formatB"/>
                        <el-table-column
                                label="C类"
                                prop=""
                                align="center" :formatter="formatC"/>
                    </el-table-column>
                    <el-table-column
                            label="结案条件"
                            prop="endsConditions"
                            align="center"/>
                    <el-table-column
                            label="归属部门"
                            prop="deptName"
                            align="center"/>
                    <el-table-column
                            label="责任主体"
                            prop="parentDeptName"
                            align="center"/>
                    <el-table-column
                            label="案件说明"
                            prop="instructions"
                            align="center"
                            show-overflow-tooltip/>
                    <el-table-column
                            label="备注"
                            prop="remark"
                            align="center"/>
                    <el-table-column
                            label="操作"
                            align="center"
                            width="100"
                            class-name="small-padding fixed-width">
                        <template slot-scope="scope">
                            <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)">编辑
                            </el-button>
                        </template>
                    </el-table-column>
                </el-table>
            </div>
            <!--<div class="pagination">
                <el-pagination v-if="isShowPage"
                               class="no-shadow"
                               @size-change="handleSizeChange"
                               @current-change="handleCurrentChange"
                               :current-page="currentPage"
                               :page-sizes="[15, 25, 50, 100]"
                               :page-size="pageSize"
                               layout="total, sizes, prev, pager, next, jumper"
                               :total="count">
                </el-pagination>
            </div>-->
        </div>
    </div>
</template>

<script>
    import {
        getListData, getcaseType, getcategoryName, getsubclassName, getresponsible, getdepartment, getprimaryIndustry,
        getsecondaryIndustry,getarchivesTypeLeveList
    } from '@/api/configure/configure'

    export default {
        name: 'Evaluation',
        data() {
            return {
                // 页面加载
                loading: true,
                disabled:true,
                //事部件
                caseType:'',
                caseTypeData: [],
                //大类名称
                categoryName: '',
                categoryNameData:[],
                //小类名称
                subclassName: '',
                subclassNameData: [],
                //归属部门
                department: '',
                departmentData: [],
                //一级行业
                primaryIndustry: '',
                primaryIndustryData: [],
                //二级行业
                secondaryIndustry: '',
                secondaryIndustryData: [],
                //责任主体
                responsible: '',
                responsibleData: [],

                // 列表数据
                tableData: [],
                spanArr: [],
                contentSpanArr: [],
                position: 0,
                position1: 0,
                // 是否显示分页
                isShowPage: true,
                // 分页页码
                currentPage: 1,
                // 每页数量
                pageSize: 15,
                // 列表数据总数
                count: 0,
                value: '全部',
                option: ''
            }
        },
        methods: {
            /**
             * Description:获取案件类型
             * Author:ybt
             * Date:2020/9/17
             */
            getType() {
                this.loading = true;
                //获取案件类型
                getcaseType().then(
                    (res) => {
                        this.caseTypeData = res.data;
                        this.loading = false;
                    }
                ).catch((error) => {
                    console.log(error, 'getcaseType');
                });
            },
            /**
             * Description:获取大类
             * Author:cy
             * Date:2020/9/21
             * @param
             */
            getCategory(){
                if(this.caseType === ''){
                    this.categoryName = '';
                    this.subclassName='';
                    return;
                }
                this.categoryName = '';
                this.categoryNameData = [];
                //获取案件大类名称
                getcategoryName({type:this.caseType}).then(
                    (res) => {
                        this.categoryNameData = res.data;
                    }
                ).catch((error) => {
                    console.log(error, 'getcategoryName');
                });
            },
            /**
             * Description:获取小类
             * Author:cy
             * Date:2020/9/21
             * @param
             */
            getSubclass(){
                if(this.categoryName === ''){
                    this.subclassName='';
                    this.responsible='';
                    return;
                }
                this.subclassName='';
                this.subclassNameData=[];
                getsubclassName({parentId:this.categoryName}).then(
                    (res) => {
                        this.subclassNameData = res.data;
                    }
                ).catch((error) => {
                    console.log(error, 'getsubclassName');
                });
            },
            //获取责任主体
            getSubject(){
                this.loading = true;
                getresponsible().then(
                    (res) => {
                        this.responsibleData = res.data;
                        this.loading = false;
                    }
                ).catch((error) => {
                    console.log(error, 'getresponsible');
                });
            },
            /**
             * Description:获取归属部门
             * Author:cy
             * Date:2020/9/21
             * @param
             */
            getDepartment(){
                if(this.responsible === ''){
                    this.department='';
                    this.primaryIndustry='';
                    this.secondaryIndustry = '';
                    return;
                }
                this.department='';
                this.departmentData=[];
                getdepartment({parentId:this.responsible}).then(
                    (res) => {
                        this.departmentData = res.data;
                    }
                ).catch((error) => {
                    console.log(error, 'getdepartment');
                });
            },
            /**
             * Description:获取一级部门
             * Author:cy
             * Date:2020/9/21
             * @param
             */
            getPrimarylist(){
                if(this.department === ''){
                    this.primaryIndustry='';
                    this.secondaryIndustry = '';
                    return;
                }
                this.primaryIndustry='';
                this.primaryIndustryData=[];
                getprimaryIndustry(this.department).then(
                    (res) => {
                        this.primaryIndustryData = res.data;
                    }
                ).catch((error) => {
                    console.log(error, 'getprimaryIndustry');
                });
            },
            /**
             * Description:获取二级部门
             * Author:cy
             * Date:2020/9/21
             * @param
             */
            getSecondarylist(){
                if(this.primaryIndustry === ''){
                    this.secondaryIndustry = '';
                    return;
                }
                this.secondaryIndustry = '';
                this.secondaryIndustryData=[];
                getsecondaryIndustry(this.primaryIndustry).then(
                    (res) => {
                        this.secondaryIndustryData = res.data;
                    }
                ).catch((error) => {
                    console.log(error, 'getsecondaryIndustry');
                });
            },
            /**
             * Description:获取表格数据
             * Author:cy
             * Date:2020/9/21
             * @param
             */
            getTableList(type){
                this.loading = true;
                let _this = this;
                let options={
                    type:_this.caseType,
                    levelOneCode:_this.categoryName,
                    levelTwoCode:_this.subclassName,
                    parentDeptCode:_this.responsible,
                    deptCode:_this.department,
                    industryTypeLv1:_this.primaryIndustry,
                    industryTypeLv2:_this.secondaryIndustry
                };
                getarchivesTypeLeveList(options).then(
                    (res) => {
                        if(res.data.length>0){
                            this.tableData = res.data;
                            if (type === 1) {
                                this.$message.success('搜索成功');
                            } else if (type === 2) {
                                this.$message.success('重置成功');
                            }
                            this.rowspan();
                            setTimeout( () => {
                                this.loading = false;
                            }, 5000)
                        }else{
                            this.tableData=[];
                            this.loading = false;
                        }
                    }
                ).catch((error) => {
                    console.log(error, 'getarchivesTypeLeveList');
                });
            },
            // 合并单元格
            objectSpanMethod({ row, column, rowIndex, columnIndex }) {
                //表格合并行
                if (columnIndex === 0) {
                    const _row = this.spanArr[rowIndex];
                    return {
                        rowspan: _row,
                        colspan: 1
                    };
                }
                if (columnIndex === 1) {
                    const _row = this.spanArr[rowIndex];
                    const _col = _row > 0 ? 1 : 0;
                    return {
                        rowspan: _row,
                        colspan: 1
                    };
                }
                if (columnIndex === 2) {
                    const _row = this.contentSpanArr[rowIndex];
                    const _col = _row > 0 ? 1 : 0;
                    return {
                        rowspan: _row,
                        colspan: 1
                    };
                }
                if (columnIndex === 3) {
                    const _row = this.contentSpanArr[rowIndex];
                    const _col = _row > 0 ? 1 : 0;
                    return {
                        rowspan: _row,
                        colspan: 1
                    };
                }
                if (columnIndex === 14) {
                    const _row = this.contentSpanArr[rowIndex];
                    const _col = _row > 0 ? 1 : 0;
                    return {
                        rowspan: _row,
                        colspan: 1
                    };
                }
            },
            rowspan() {
                this.tableData.forEach((item, index) => {
                    if (index === 0) {
                        this.spanArr.push(1);
                        this.contentSpanArr.push(1);
                        this.position = 0;
                        this.position1 = 0;
                    } else {
                        if (this.tableData[index].levelOneCode === this.tableData[index - 1].levelOneCode) {
                            this.spanArr[this.position] += 1;
                            this.spanArr.push(0);
                        } else {
                            this.spanArr.push(1);
                            this.position = index;
                        }
                        if (this.tableData[index].levelTwoCode === this.tableData[index - 1].levelTwoCode) {
                            this.contentSpanArr[this.position1] += 1;
                            this.contentSpanArr.push(0);
                        } else {
                            this.contentSpanArr.push(1);
                            this.position1 = index;
                        }
                    }
                });
            },
            formatA(value){
                let content = '';
                let data = value.archivesDisposal;
                if (data.length > 0) {
                    for (let i = 0; i < data.length; i++) {
                        if (data[i].disposalType == "A") {
                            content += data[i].times;
                            if (data[i].timesType == 1) {
                                content += "紧急";
                            }
                            if (data[i].timesUnit == 1) {
                                content += "工作时"
                            }
                            if (data[i].timesUnit == 2) {
                                content += "工作日"
                            }
                            break;
                        }
                    }
                }
                return content;
            },
            formatB(value){
                let content = '';
                let data = value.archivesDisposal;
                if (data.length > 0) {
                    for (let i = 0; i < data.length; i++) {
                        if (data[i].disposalType == "B") {
                            content += data[i].times;
                            if (data[i].timesType == 1) {
                                content += "紧急";
                            }
                            if (data[i].timesUnit == 1) {
                                content += "工作时"
                            }
                            if (data[i].timesUnit == 2) {
                                content += "工作日"
                            }
                            break;
                        }
                    }
                }
                return content;
            },
            formatC(value){
                let content = '';
                let data = value.archivesDisposal;
                if (data.length > 0) {
                    for (let i = 0; i < data.length; i++) {
                        if (data[i].disposalType == "C") {
                            content += data[i].times;
                            if (data[i].timesType == 1) {
                                content += "紧急";
                            }
                            if (data[i].timesUnit == 1) {
                                content += "工作时"
                            }
                            if (data[i].timesUnit == 2) {
                                content += "工作日"
                            }
                            break;
                        }
                    }
                }
                return content;
            },
            /**
             * Description:点击【搜索】按钮触发
             * Author:ybt
             * Date:2020/9/17
             */
            handleQuery() {
                this.tableData=[];
                this.spanArr=[];
                this.contentSpanArr=[];
                this.position = 0;
                this.position1 = 0;
                this.getTableList(1);
            },
            /**
             * Description:点击【重置】按钮触发
             * Author:ybt
             * Date:2020/9/17
             */
            resetQuery() {
                this.caseType='';
                this.categoryName='';
                this.subclassName='';
                this.responsible='';
                this.department='';
                this.primaryIndustry='';
                this.secondaryIndustry='';
                this.tableData=[];
                this.spanArr=[];
                this.contentSpanArr=[];
                this.position = 0;
                this.position1 = 0;
                this.getTableList(2);
            },
            /**
             * Description:【编辑】按钮触发
             * Author:ybt
             * Date:2020/9/17
             */
            handleUpdate(row) {
                this.$router.replace({
                    path: "/evaluation/editstandards1",
                    name:'editstandards1',
                    query: {
                        id:row.archivesTypeLeveTwo.id
                    }
                })
            },
            /**
             * Description:切换分页数量
             * Author:ybt
             * Date:2020/9/17
             */
            handleSizeChange(size) {
                this.pageSize = size;
                this.currentPage = 1;
                this.getList();
            },
            /**
             * Description:切换分页
             * Author:ybt
             * Date:2020/9/17
             */
            handleCurrentChange(currentPage) {
                this.currentPage = currentPage;
                this.getList();
            }
        },
        created() {
            // 获取搜索列表数据
            this.getType();
            this.getSubject();
            //获取表格数据
            this.getTableList();
        }
    }
</script>

<style scoped lang="scss">
    .evaluation {
        width: 100%;
        height: 100%;
        padding: 0.125rem 0.1875rem;
        display: flex;
        flex-direction: column;
        .search-area {
            display: flex;
            flex-direction: row;
            flex-wrap: wrap;
            background-color: #FFFFFF;
            padding: 0.125rem;
            border-radius: 0.075rem;
            .item-box {
                display: flex;
                flex-direction: row;
                height: 0.4rem;
                line-height: 0.4rem;
                font-size: 0.175rem;
                margin: 0.0625rem 0.1875rem 0.0625rem 0;
                .item-value {
                    width: 3rem;
                }
            }
        }
        .content-area {
            display: flex;
            flex-direction: column;
            flex: 1;
            background-color: #FFFFFF;
            padding: 0.125rem;
            border-radius: 0.075rem;
            margin-top: 0.1875rem;
            overflow: hidden;
            .table-list {
                display: flex;
                flex: 1;
                margin: 0.125rem 0;
                overflow: hidden;
                .el-table {
                    flex: 1;
                    overflow-y: auto;
                }
            }
        }
    }
</style>
<style>
    .el-tooltip__popper {
        max-width: 80%;
    }
</style>
